<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<link href="<%=application.getContextPath() %>/css/css.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="<%=application.getContextPath() %>/js/jquery-1.6.min.js"></script>	
<script language="javascript" src="<%=application.getContextPath() %>/js/calendar_eu.js"></script>
<script type="text/javascript" src="<%=application.getContextPath() %>/js/jquery-ui-1.8.17.custom.min.js"></script>	
<link rel="stylesheet" href="<%=application.getContextPath() %>/css/jquery-ui-1.8.17.custom.css"/>
<script type="text/javascript">
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
</script>
<script type="text/javascript">
function gettotal(d){
	var id=d.id;
	var temp=id.split("_");
	var cnt=temp[1];
	var te=0;
	var cp=0;
	var fe=0;
	if($("#te_"+cnt).val()!=""){
		te=parseFloat($("#te_"+cnt).val());
	}
	if($("#cp_"+cnt).val()!=""){
		cp=parseFloat($("#cp_"+cnt).val());
	}
	if($("#fe_"+cnt).val()!=""){
		fe=parseFloat($("#fe_"+cnt).val());
	}
	var total=te+cp+fe;
	total=total.toFixed(2);
	$("#total_"+cnt).val(total);
	var rCount=$("#rCount").val();
	var grdtot=0;
	for(var i=1;i<=parseFloat(rCount);i++){
		if($("#total_"+i).val()!=null){
			if($("#total_"+i).val()!=""){
				grdtot+=parseFloat($("#total_"+i).val());
			}
		}
	}
	$("#grdtotal").val(grdtot);
}
</script>
<script type="text/javascript">
function getBudgetPlan(){
	var mnth=$("#mnth").val();
	var year=$("#year").val();
	var data="month="+mnth+"&year="+year;
	
	$.ajax({
		url:"<%=application.getContextPath() %>/budgetPlanner/getbudget.do",
		mimetype: "text/html",
		method: "post",
		cache: false,
		data: data,
		success: function(res){
			$("#bdTable").hide();
			$("#budgetTable").html(res);
		}
		
	});
	
}
</script>
</head>
<style>
	#editor{
	width:95%;
	}
	#remarksEditor{
	width:95%;
	}
	#nextsteppopup {
	position:absolute;
  z-index:200; /* aaaalways on top*/
  padding: 3px;
 
  width: 250px;
  color: white;
	}
	.ui-dialog .ui-state-error { padding: .3em; }
	.ui-corner-all{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: normal;
	color: #666666;
	text-decoration: none;
	}
	.ui-corner-all:hover{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: normal;
	color: #666666;
	text-decoration: none;
	}
	.logout{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	height: 15px;
	width: 50px;
	font-weight: normal;
	color: red;
	text-decoration: none;
	}
	#bulletinDialog title{
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	font-weight:bold;
	}
	</style>


<script  type="text/javascript">
$(document).ready(function(){
$('.popup').live('click',function(){
var id=this.id;
//alert(id);
var $dialog = $('#bulletinDialog').dialog({
                autoOpen: false,
                modal: true,
                width: 285,
                height: 230,
				
				
            });
 			$("#editor").attr("class", id);
			var text=$("#nst"+id).val();
			$("."+id).val(text);
           // $("#bulletinDialog").parent().appendTo($("form:first"));
 
            $dialog.dialog('open');
});
});

		
    </script>
<script  type="text/javascript">
$(document).ready(function(){
$('.popup2').live('click',function(){
var id=this.id;
//alert(id);
var $dialog = $('#remarksDialog').dialog({
                autoOpen: false,
                modal: true,
                width: 285,
                height: 230
				
            });
 			$("#remarksEditor").attr("class", id);
			var text=$("#rem"+id).val();
			$("."+id).val(text);
           // $("#bulletinDialog").parent().appendTo($("form:first"));
 
            $dialog.dialog('open');
});
});

		
    </script>
	<script>
	$(document).ready(function(){
$('.tablebox-form').live('click',function(){
	
	var id=this.id;
	
		var availableTags = [
			"Advaithsoft",
			"APJENCO",
			"APSRTC",
			"BHEL",
			"BPCL",
			"CDOL",
			"Clojure",
			"COBOL",
			"ColdFusion",
			"Ecil",
			"Fortran",
			"CHARMINAR",
			"HPCL",
			"IOCL",
			"JPCEMENT",
			"JavaScript",
			"LAns",
			"Perl",
			"POCL",
			"PMCL",
			"Ruby",
			"SOCL",
			"SHAR"
		];
		
		
		$('#'+id).autocomplete({
			source: availableTags
		});
		jQuery('.ui-autocomplete').css({'font-size':'10px','font-family':'Arial','max-height': '100px',
	'overflow-y': 'auto', 'padding-right': '20px', 'overflow-x': 'hidden'});
	
	})
	});
	
	</script>
<script language="javascript">
var newRowCount=1;

        function addRow(infotable) {
 			newRowCount=parseInt($("#rCount").val());
            var table = document.getElementById(infotable);
 			var rowCount = table.rows.length;
			var row = table.insertRow(rowCount);
			row.className="tablebox-form";
			
		    var cell1 = row.insertCell(0);
			cell1.setAttribute("bgColor","#CCCCCC");
            var element1 = document.createElement("input");
            element1.type = "checkbox";
            cell1.appendChild(element1);
 				
			
			 var cell2 = row.insertCell(1);
			 cell2.setAttribute("bgColor","#CCCCCC");
			 cell2.innerHTML='<input type="text" name="org'+(newRowCount+1)+'" id="org_'+(newRowCount+1)+'" class="tdinput" value="" />';
			
			
			var cell3 = row.insertCell(2);
			cell3.setAttribute("bgColor","#CCCCCC");
			 cell3.innerHTML='<input type="text" name="loc'+(newRowCount+1)+'" id="loc_'+(newRowCount+1)+'" class="tdinput" value="" />';
			
			
			var cell4 = row.insertCell(3);
			cell4.setAttribute("bgColor","#CCCCCC");
			 cell4.innerHTML='<input type="text" name="te'+(newRowCount+1)+'" id="te_'+(newRowCount+1)+'" class="tdinput" value="" onchange="javascript: gettotal(this)"/>';
						
			var cell5 = row.insertCell(4);
			cell5.setAttribute("bgColor","#CCCCCC");
			 cell5.innerHTML='<input type="text" name="cp'+(newRowCount+1)+'" id="cp_'+(newRowCount+1)+'" class="tdinput" value="" onchange="javascript: gettotal(this)"/>';
					 
			var cell6 = row.insertCell(5);
			cell6.setAttribute("bgColor","#CCCCCC");
			 cell6.innerHTML='<input type="text" name="fe'+(newRowCount+1)+'" id="fe_'+(newRowCount+1)+'" class="tdinput" value="" onchange="javascript: gettotal(this)"/>';
			 			
		    var cell7 = row.insertCell(6);
			cell7.setAttribute("bgColor","#CCCCCC");
			 cell7.innerHTML='<input type="text" name="total'+(newRowCount+1)+'" id="total_'+(newRowCount+1)+'" class="tdinput" value="" readonly="readonly"/>';
		        
			 newRowCount++;
		        $("#rCount").val(newRowCount);
 
        }
 
        function deleteRow(infotable) {
            try {
            var table = document.getElementById(infotable);
            var rowCount = table.rows.length;
 
            for(var i=0; i<rowCount; i++) {
                var row = table.rows[i];
                var chkbox = row.cells[0].childNodes[0];
                if(null != chkbox && true == chkbox.checked) {
                    table.deleteRow(i);
                    rowCount--;
                    i--;
                }
 
            }
			
            }catch(e) {
                alert(e);
            }
        }
 
    </script>
    <script>

	$(function() {
		$( "#datepicker" ).datepicker({ dateFormat: "dd-mm-yy" });
	});
	</script>
<body onload="MM_preloadImages('<%=application.getContextPath() %>/images/mb-hover.jpg','<%=application.getContextPath() %>/images/bp-hover.jpg','<%=application.getContextPath() %>/images/sp-hover.jpg')">
<form action="<%=application.getContextPath() %>/budgetPlanner/save.do" method="post" name="myform">
<table width="927" style="height:880px" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
  <tr>
    <td height="116" align="left" valign="top" background="<%=application.getContextPath() %>/images/top-bg.jpg" style="background-repeat:repeat-x; background-position:left top">
    <%@ include file="common/exe-header.jsp" %></td>
  </tr>
  <tr>
    <td align="left" valign="top">
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
    	<tr>
    		<td align="left" valign="top">&nbsp;&nbsp;
    			<a href="<%=application.getContextPath() %>/user/open.do"><img src="<%=application.getContextPath() %>/images/home1.jpg" width="20" height="20" border="0" /></a>
    		</td>
    	<td align="center" valign="top">
    	<%
        if(request.getParameter("success")!=null){
        	out.println(request.getParameter("success"));
        }
        %>
    	</td>
    	<td width="8%" align="center"><a href="<%=application.getContextPath() %>/user/logout.do" style="font-family: sans-serif;">&nbsp;&nbsp;Logout</a></td>
    	</tr>
    	
    </table>
    </td>
  </tr>
  <tr>
    <td  align="left" valign="top"><table width="100%" height="298" border="0" cellpadding="0" cellspacing="0">
      <tr>
        <td width="23%" align="center" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
          <tr>
            <td width="5%">&nbsp;</td>
            <td width="95%"><a href="<%=application.getContextPath() %>/mybudget/open.do" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image2','','<%=application.getContextPath() %>/images/mb-hover.jpg',1)"><img src="<%=application.getContextPath() %>/images/mb-active.jpg" name="Image2" width="190" height="58" border="0" id="Image2" /></a></td>
            </tr>
          <tr>
            <td>&nbsp;</td>
            <td><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image3','','<%=application.getContextPath() %>/images/bp-hover.jpg',1)"><img src="<%=application.getContextPath() %>/images/bp-hover.jpg" name="Image3" width="190" height="62" border="0" id="Image3" /></a></td>
            </tr>
          <tr>
            <td>&nbsp;</td>
            <td><a href="https://www.google.com/calendar" target="_blank" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image4','','<%=application.getContextPath() %>/images/sp-hover.jpg',1)"><img src="<%=application.getContextPath() %>/images/sp-active.jpg" name="Image4" width="190" height="57" border="0" id="Image4" /></a></td>
            </tr>
        </table></td>
        <td width="76%" valign="top"><table width="100%" cellpadding="0" cellspacing="0" border="0"  class="box-border1">
          <tr>
            <td width="99%" align="left" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td align="center" valign="top" class="icon-header2"><strong>Budget Planner</strong></td>
              </tr>
              <tr>
                <td align="right" valign="top">&nbsp;</td>
              </tr>
              <tr>
                <td align="left" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0" >
                    <tr>
                      
                      <td width="12%" align="left">&nbsp;<select name="month" class="form2" id="mnth" onchange="javascript: getqtr()">
                          <option value="">Month</option>
                          <option value="01">Jan</option>
                          <option value="02">Feb</option>
                          <option value="03">Mar</option>
                          <option value="04">Apr</option>
                          <option value="05">May</option>
                          <option value="06">Jun</option>
                          <option value="07">Jul</option>
                          <option value="08">Aug</option>
                          <option value="09">Sep</option>
                          <option value="10">Oct</option>
                          <option value="11">Nov</option>
                          <option value="12">Dec</option>
                      </select></td>
                      <td width="1%" align="center">&nbsp;</td>
                      <td width="12%" align="left"><div style="font-family:Arial, Helvetica, sans-serif; font-size:13px" id="qtr"></div></td>
                      <td width="25%" align="left"><select name="year" id="year" class="form2" onchange="javascript: getBudgetPlan()">
                          <option value="">Year</option>
                          <option value="2012">2012</option>
                          <option value="2013">2013</option>
                          <option value="2014">2014</option>
                          <option value="2015">2015</option>
                          <option value="2016">2016</option>
                          <option value="2017">2017</option>
                          <option value="2018">2018</option>
                          <option value="2019">2019</option>
                          <option value="2020">2020</option>
                          <option value="2021">2021</option>
                          <option value="2022">2022</option>
                      </select></td>
                      <td width="28%" align="right" class="icon-header2">Total</td>
                      <td width="17%">&nbsp;&nbsp;</td>
                      <td width="5%">&nbsp;</td>
                    </tr>
                </table></td>
              </tr>
              
              <tr>
                <td align="left" valign="top" >
                <div id="budgetTable">
                <div id="bdTable" >
                <div align="right">(in lacs)</div>
                <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
                    <tr>
                      <td width="100%"><div id="demo">
                          <table width="100%" border="0" align="center" cellpadding="3" cellspacing="1" bgcolor="#ffffff" class="tablebox" id="infoTable" background="<%=application.getContextPath() %>/images/hed-bg-block.jpg" style="background-repeat:repeat-x; background-position:left top">
                            <thead>
                              <tr >
                              <th width="3%"  align="center" valign="middle" class="hed">&nbsp;</th>
                                <th width="26%"  align="center" valign="middle" class="hed">Customer</th>
                                <th width="22%"  align="center" valign="middle" class="hed">Location</th>
                                <th width="13%"  align="center" valign="middle" class="hed">T.E</th>
                                <th width="13%"  align="center" valign="middle" class="hed">C.P</th>
                                <th width="12%"  align="center" valign="middle" class="hed">F.E</th>
                                <th width="14%"  align="center" valign="middle" class="hed">Total</th>
                              </tr>
                            </thead>
                            <tbody>
                            
                              <tr>
                              	<td align="center" bgcolor="#CCCCCC"><input type="checkbox" name="checkbox" class="tdinput" value="checkbox" /></td>
                                <td align="center" bgcolor="#CCCCCC"><input type="text" name="org1" id="org_1" class="tdinput" value="" /></td>
                                <td align="center" bgcolor="#CCCCCC"><input type="text" name="loc1" id="loc_1" class="tdinput" value="" /></td>
                                <td  bgcolor="#CCCCCC"><input type="text" name="te1" id="te_1" class="tdinput" value=""  onchange="javascript: gettotal(this)"/></td>
                                <td align="center" bgcolor="#CCCCCC"><input type="text" name="cp1" id="cp_1" class="tdinput" value="" onchange="javascript: gettotal(this)"/></td>
                                <td align="center" bgcolor="#CCCCCC"><input type="text" name="fe1" id="fe_1" class="tdinput" value="" onchange="javascript: gettotal(this)" /></td>
                                <td align="center" bgcolor="#CCCCCC"><input type="text" name="total1" id="total_1" class="tdinput" value="" readonly="readonly"/></td>
                              </tr>
                              
                            </tbody>
                          </table>
                      </div></td>
                   			 </tr>
                   			 <tr>
                    			<td align="right" bgcolor="#CCCCCC">
                    			<table width="100%" border="0" cellpadding="0" cellspacing="0">
                    			<tr>
                              	<td align="center" bgcolor="#CCCCCC">&nbsp;</td>
                                <td align="center" bgcolor="#CCCCCC">&nbsp;</td>
                                <td align="center" bgcolor="#CCCCCC">&nbsp;</td>
                                <td  bgcolor="#CCCCCC"></td>
                                <td align="center" bgcolor="#CCCCCC">&nbsp;</td>
                                <td align="right" bgcolor="#CCCCCC">&nbsp;Grand Total:</td>
                                <td align="right" valign="middle" width="11%" bgcolor="#CCCCCC">
                                <input type="text" align="middle" name="grdtotal" id="grdtotal" class="tdinput" value="0" readonly="readonly"/></td>
                              </tr>
                              </table>
                    			</td>
                                
                              </tr>
                    <tr>
                      <td height="10" align="left" valign="top"><table width="599" border="0" cellpadding="0" cellspacing="0">
                        <tr>
                          <td width="30"  ><a href="javascript: addRow('infoTable')" style="font-size:24px; font-weight:bold" title="Add Row">+</a></td>
                          <td width="30"  ><a href="javascript: deleteRow('infoTable')"  style="font-size:24px; font-weight:bold" title="Delete Row">-</a></td>
                          <td width="359" >&nbsp;</td>
                          <td width="30" align="right">&nbsp;</td>
                          <td width="30" align="right">&nbsp;</td>
                        </tr>
                       
                      </table></td>
                    </tr>
                    <tr>
                      <td align="left" valign="top"><input type="hidden" id="rCount" value="1"/>
                      	<input type="reset" class="button-black-right" value="Clear"/>
                      	<input type="submit" class="button-black-right" value="Save"/>
                      </td>
                    </tr>
                    <tr>
                      <td align="left" valign="top">&nbsp;</td>
                      
                    </tr>
                </table>
                </div>
                </div>
                </td>
              </tr>
            </table></td>
          </tr>
        </table></td>
        <td width="3%" valign="top">&nbsp;</td>
        </tr>
    </table></td>
  </tr>
  <tr>
    <td height="40" align="left" valign="top" bgcolor="#0B0B0B">&nbsp;</td>
  </tr>
</table></form>
</body>
</html>
<script type="text/javascript">
$("#ok").click(function(){

var b= $("#editor").val();
//alert(b);
var cls=$('#editor').attr('class');
//alert(cls);

var text=$('#nst'+cls).val(b);
$('#bulletinDialog').dialog('close');

//alert(text.val());
});

</script>
<script type="text/javascript">
$("#save").click(function(){

var b= $("#remarksEditor").val();
//alert(b);
var cls=$('#remarksEditor').attr('class');
//alert(cls);

var text=$('#rem'+cls).val(b);
$('#remarksDialog').dialog('close');

//alert(text.val());
});

</script>

<script type = "text/javascript">
function update() {
var counter = 0;
var tab=document.getElementById("infoTable");
var rowCount = tab.rows.length;
//alert(rowCount);
for(var i=1;i<rowCount;i++)
{
var a = $("#org"+i).val();
//alert(a);
a = a.replace(/^\s+|\s+$/g,""); // strip leading and trailing spaces
if (a!="") {counter ++;}
document.myform.count.value = counter;
}
}

</script>
<script type = "text/javascript">
function getqtr(){
var mnth=$('#mnth').val();
if(mnth!=""){
if(mnth=="04" || mnth=="05" || mnth=="06"){
$('#qtr').html("Quarter-1");
}else if(mnth=="07" || mnth=="08" || mnth=="09"){
$('#qtr').html("Quarter-2");
}else if(mnth=="10" || mnth=="11" || mnth=="12"){
$('#qtr').html("Quarter-3");
}else if(mnth=="01" || mnth=="02" || mnth=="03"){
$('#qtr').html("Quarter-4");
}
}else{
	$('#qtr').html("");
}
var year=$("#year").val();
var data="month="+mnth+"&year="+year;

$.ajax({
	url:"<%=application.getContextPath() %>/budgetPlanner/getbudget.do",
	mimetype: "text/html",
	method: "post",
	cache: false,
	data: data,
	success: function(res){
		$("#bdTable").hide();
		$("#budgetTable").html(res);
	}
	
});
}
</script>